import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools'
import tailwindcss from '@tailwindcss/vite'
import Pages from 'vite-plugin-pages'
import Layouts from 'vite-plugin-vue-layouts'
import pxtorem from 'postcss-pxtorem';

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    // vueDevTools(),
    tailwindcss(),
    Pages({
      dirs: 'src/pages',
      exclude: ['**/components/*.vue'],
      routeBlockLang: 'json',
    }),
    Layouts({
      layoutsDirs: 'src/layouts',
      defaultLayout: 'default'
    }),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    },
  },
  server: {
    host: '0.0.0.0', // 监听所有地址，包括局域网和公网
    port: 3000,      // 设置自定义端口号
    strictPort: true // 如果端口被占用，直接退出
  },
  css: {
    postcss: {
      plugins: [
        pxtorem({
          rootValue: 14, // 根元素字体大小，与tailwind.css中设置的14px一致
          unitPrecision: 5, // 保留的小数位数
          propList: ['*'], // 需要转换的属性列表，*表示所有属性
          selectorBlackList: [], // 忽略的选择器列表
          replace: true, // 直接替换而不是追加声明
          mediaQuery: false, // 允许在媒体查询中转换px
          minPixelValue: 2, // 设置要替换的最小像素值
        }),
      ],
    },
  },
})
